﻿<%@ Control Language="C#" AutoEventWireup="true" CodeFile="UpdateMemberInfo.ascx.cs" Inherits="UserControls_WebUserControl" %>
<style type="text/css">

    .auto-style2 {
        width: 62%;
        height: 494px;
        font-family: Arial, Helvetica, sans-serif;
        font-size: 8pt;
        background-color: white;
    }
    .auto-style3 {
        text-align: right;
        font-weight: bold;
    }
    .auto-style6 {
        width: 131px;
    }
    .auto-style5 {
        width: 354px;
    }
    .auto-style7 {
        width: 131px;
        text-align: center;
    }
    .auto-style8 {
        text-align: right;
        font-weight: bold;
        height: 16px;
    }
    .auto-style9 {
        text-align: right;
        font-weight: bold;
        height: 8px;
    }
    .auto-style10 {
        text-align: right;
        font-weight: bold;
        height: 25px;
    }
    .auto-style11 {
        width: 131px;
        text-align: center;
        height: 25px;
    }
    .auto-style12 {
        width: 131px;
        height: 25px;
    }
    .auto-style13 {
        width: 354px;
        height: 25px;
    }
    </style>

<table class="auto-style2" style="border: thin solid #99CCFF; text-indent: 10px; margin-left: 10px; margin-top: 10px;">
    <tr>
        <td class="auto-style8" colspan="4" style="text-align: left">
            <span style="color: rgb(236, 167, 109); font-family: tahoma; font-size: 22px; font-style: normal; font-variant: normal; font-weight: bold; letter-spacing: normal; line-height: normal; orphans: auto; text-align: left; text-indent: 0px; text-transform: none; white-space: normal; widows: auto; word-spacing: 0px; -webkit-text-stroke-width: 0px; display: inline !important; float: none;">Edit User Information</span></td>
    </tr>
    <tr>
        <td class="auto-style9" colspan="4" style="text-align: left">
            <span style="color: rgb(236, 167, 109); font-family: tahoma; font-size: 14px; font-style: normal; font-variant: normal; font-weight: bold; letter-spacing: normal; line-height: normal; orphans: auto; text-align: start; text-indent: 0px; text-transform: none; white-space: normal; widows: auto; word-spacing: 0px; -webkit-text-stroke-width: 0px; display: inline !important; float: none;">Click Edit to keep or modify each field's information.</span></td>
    </tr>
    <tr>
        <td class="auto-style3" colspan="4" style="text-align: left">
            <span style="color: rgb(236, 167, 109); font-family: tahoma; font-size: 14px; font-style: normal; font-variant: normal; font-weight: bold; letter-spacing: normal; line-height: normal; orphans: auto; text-align: start; text-indent: 0px; text-transform: none; white-space: normal; widows: auto; word-spacing: 0px; -webkit-text-stroke-width: 0px; display: inline !important; float: none;">You are required to provide information for all fields.</span></td>
    </tr>
    <tr>
        <td class="auto-style3" colspan="4" style="text-align: left">
            &nbsp;</td>
    </tr>
    <tr>
        <td class="auto-style10">
            <asp:Label ID="Label1" runat="server" Text="First Name:"></asp:Label>
        </td>
        <td class="auto-style11">
            <asp:Label ID="lblFirst" runat="server" Text="Label"></asp:Label>
            <asp:LinkButton ID="lbFName" runat="server" OnClick="lbFName_Click" CausesValidation="false" ForeColor="#003366">Edit</asp:LinkButton>
        </td>
        <td class="auto-style12">
            <asp:TextBox ID="txtFirst" runat="server" Width="158px" style="font-size: 9pt" ></asp:TextBox>
        </td>
        <td class="auto-style13">
            <asp:RequiredFieldValidator ID="RequiredFieldValidator1" runat="server" ControlToValidate="txtFirst" ErrorMessage="First Name is required" ForeColor="#990033" Display="Dynamic" SetFocusOnError="True"></asp:RequiredFieldValidator>
            <asp:RegularExpressionValidator ID="RegularExpressionValidator5" runat="server" ControlToValidate="txtFirst" Display="Dynamic" ErrorMessage="You cannot use numbers in your name" ForeColor="#990033" SetFocusOnError="True" ValidationExpression="^[a-zA-Z\s]+$"></asp:RegularExpressionValidator>
        </td>
    </tr>
    <tr>
        <td class="auto-style3">
            <asp:Label ID="Label2" runat="server" Text="Last Name:"></asp:Label>
        </td>
        <td class="auto-style7">
            <asp:Label ID="lblLast" runat="server" Text="Label"></asp:Label>
            <asp:LinkButton ID="lbLast" runat="server" CausesValidation="false" ForeColor="#003366" OnClick="lbLast_Click" >Edit</asp:LinkButton>
        </td>
        <td class="auto-style6">
            <asp:TextBox ID="txtLast" runat="server" Width="155px" style="font-size: 9pt"></asp:TextBox>
        </td>
        <td class="auto-style5">
            <asp:RequiredFieldValidator ID="RequiredFieldValidator2" runat="server" ControlToValidate="txtLast" ErrorMessage="Last Name is required" ForeColor="#990033" Display="Dynamic" SetFocusOnError="True"></asp:RequiredFieldValidator>
            <asp:RegularExpressionValidator ID="RegularExpressionValidator6" runat="server" ControlToValidate="txtLast" Display="Dynamic" ErrorMessage="You cannot use numbers in your name" ForeColor="#990033" SetFocusOnError="True" ValidationExpression="^[a-zA-Z\s]+$"></asp:RegularExpressionValidator>
        </td>
    </tr>
    <tr>
        <td class="auto-style3">
            <asp:Label ID="Label12" runat="server" Text="Gender:"></asp:Label>
        </td>
        <td class="auto-style7">
            <asp:Label ID="lblGender" runat="server" Text="Label"></asp:Label>
            <asp:LinkButton ID="lbGender" runat="server" CausesValidation="false" ForeColor="#003366" OnClick="lbGender_Click">Edit</asp:LinkButton>
        </td>
        <td class="auto-style6">
            <asp:DropDownList ID="ddlGen" runat="server" style="font-size: 9pt">
                <asp:ListItem>Male</asp:ListItem>
                <asp:ListItem>Female</asp:ListItem>
            </asp:DropDownList>
        </td>
        <td class="auto-style5">
            &nbsp;</td>
    </tr>
    <tr>
        <td class="auto-style3">
            <asp:Label ID="Label3" runat="server" Text="Age:"></asp:Label>
        </td>
        <td class="auto-style7">
            <asp:Label ID="lblAge" runat="server" Text="Label"></asp:Label>
            <asp:LinkButton ID="lbAge" runat="server" CausesValidation="false" ForeColor="#003366" OnClick="lbAge_Click">Edit</asp:LinkButton>
        </td>
        <td class="auto-style6">
            <asp:TextBox ID="txtUserAge" runat="server" Width="47px" ToolTip="At least 18 years" style="font-size: 9pt"></asp:TextBox>
        </td>
        <td class="auto-style5">
            <asp:RequiredFieldValidator ID="RequiredFieldValidator3" runat="server" ControlToValidate="txtUserAge" ErrorMessage="Age is required" ForeColor="#990033" Display="Dynamic" SetFocusOnError="True"></asp:RequiredFieldValidator>
            <asp:RangeValidator ID="RangeValidator1" runat="server" ControlToValidate="txtUserAge" Display="Dynamic" ErrorMessage="Incorrect input. Also you must be at least 18 years old to register." ForeColor="#990033" MaximumValue="150" MinimumValue="18" SetFocusOnError="True" Type="Integer"></asp:RangeValidator>
        </td>
    </tr>
    <tr>
        <td class="auto-style3">
            <asp:Label ID="Label5" runat="server" Text="Street Address:"></asp:Label>
        </td>
        <td class="auto-style7">
            <asp:Label ID="lblStreet" runat="server" Text="Label"></asp:Label>
            <asp:LinkButton ID="lbStreet" runat="server" CausesValidation="false" ForeColor="#003366" OnClick="lbStreet_Click">Edit</asp:LinkButton>
        </td>
        <td class="auto-style6">
            <asp:TextBox ID="txtStreet" runat="server" Width="156px" style="font-size: 9pt"></asp:TextBox>
        </td>
        <td class="auto-style5">
            <asp:RequiredFieldValidator ID="RequiredFieldValidator5" runat="server" ControlToValidate="txtStreet" ErrorMessage="Street Address is required" ForeColor="#990033" Display="Dynamic" SetFocusOnError="True"></asp:RequiredFieldValidator>
        </td>
    </tr>
    <tr>
        <td class="auto-style3">
            <asp:Label ID="Label7" runat="server" Text="Province: "></asp:Label>
        </td>
        <td class="auto-style7">
            <asp:Label ID="lblProv" runat="server" Text="Label"></asp:Label>
            <asp:LinkButton ID="lbProv" runat="server" CausesValidation="false" ForeColor="#003366" OnClick="lbProv_Click">Edit</asp:LinkButton>
        </td>
        <td class="auto-style6">
            <asp:DropDownList ID="ddlProv" runat="server" DataSourceID="CustomerInfoSource" DataTextField="ProvCode" DataValueField="ProvCode" style="font-size: 9pt">
            </asp:DropDownList>
            <asp:SqlDataSource ID="CustomerInfoSource" runat="server" ConnectionString="<%$ ConnectionStrings:BalloonShopConnection %>" SelectCommand="SELECT [ProvCode] FROM [Provinces]"></asp:SqlDataSource>
        </td>
        <td class="auto-style5">&nbsp;</td>
    </tr>
    <tr>
        <td class="auto-style3">
            <asp:Label ID="Label6" runat="server" Text="City: "></asp:Label>
        </td>
        <td class="auto-style7">
            <asp:Label ID="lblCity" runat="server"></asp:Label>
            <asp:LinkButton ID="lbCity" runat="server" CausesValidation="false" ForeColor="#003366" OnClick="lbCity_Click">Edit</asp:LinkButton>
        </td>
        <td class="auto-style6">
            <asp:DropDownList ID="ddlUserCity" runat="server" Height="26px" Width="130px" AutoPostBack="True" DataSourceID="CustomerCityInfo" DataTextField="City" DataValueField="City" style="font-size: 9pt">
            </asp:DropDownList>
            <asp:SqlDataSource ID="CustomerCityInfo" runat="server" ConnectionString="<%$ ConnectionStrings:BalloonShopConnection %>" SelectCommand="SELECT [City] FROM [Cities] WHERE ([ProvCode] = @ProvCode)">
                <SelectParameters>
                    <asp:ControlParameter ControlID="ddlProv" Name="ProvCode" PropertyName="SelectedValue" Type="String" />
                </SelectParameters>
            </asp:SqlDataSource>
        </td>
        <td class="auto-style5">&nbsp;</td>
    </tr>
    <tr>
        <td class="auto-style3">
            <asp:Label ID="Label8" runat="server" Text="Postal Code:"></asp:Label>
        </td>
        <td class="auto-style7">
            <asp:Label ID="lblPostal" runat="server" Text="Label"></asp:Label>
            <asp:LinkButton ID="lbPostal" runat="server" CausesValidation="false" ForeColor="#003366" OnClick="lbPostal_Click">Edit</asp:LinkButton>
        </td>
        <td class="auto-style6">
            <asp:TextBox ID="txtPostalCode" runat="server" style="font-size: 9pt" ></asp:TextBox>
        </td>
        <td class="auto-style5">
            <asp:RequiredFieldValidator ID="RequiredFieldValidator6" runat="server" ControlToValidate="txtPostalCode" ErrorMessage="Postal Code is required" ForeColor="#990033" Display="Dynamic" SetFocusOnError="True"></asp:RequiredFieldValidator>
            <asp:RegularExpressionValidator ID="RegularExpressionValidator2" runat="server" ControlToValidate="txtPostalCode" Display="Dynamic" ErrorMessage="Postal code is not in the correct format" ForeColor="#990033" SetFocusOnError="True" ValidationExpression="^[ABCEGHJKLMNPRSTVXY]\d[ABCEGHJKLMNPRSTVWXYZ]( )?\d[ABCEGHJKLMNPRSTVWXYZ]\d$"></asp:RegularExpressionValidator>
        </td>
    </tr>
    <tr>
        <td class="auto-style3">
            <asp:Label ID="Label13" runat="server" Text="Phone Number:"></asp:Label>
        </td>
        <td class="auto-style7">
            <asp:Label ID="lblPhone" runat="server" Text="Label"></asp:Label>
            <asp:LinkButton ID="lbPhone" runat="server" CausesValidation="false" ForeColor="#003366" OnClick="lbPhone_Click">Edit</asp:LinkButton>
        </td>
        <td class="auto-style6">
            <asp:TextBox ID="txtPhoneNum" runat="server" Width="151px" ToolTip="xxx-xxx-xxxx" Font-Size="9pt" style="font-size: 9pt"></asp:TextBox>
        </td>
        <td class="auto-style5">
            <asp:RequiredFieldValidator ID="RequiredFieldValidator10" runat="server" ControlToValidate="txtPhoneNum" Display="Dynamic" ErrorMessage="Phone Number is required" ForeColor="#990033" SetFocusOnError="True"></asp:RequiredFieldValidator>
            <asp:RegularExpressionValidator ID="RegularExpressionValidator3" runat="server" ControlToValidate="txtPhoneNum" Display="Dynamic" ErrorMessage="Phone number is in incorrect format" ForeColor="#990033" SetFocusOnError="True" ValidationExpression="^(\([2-9]|[2-9])(\d{2}|\d{2}\))(-|.|\s)?\d{3}(-|.|\s)?\d{4}$"></asp:RegularExpressionValidator>
        </td>
    </tr>
    <tr>
        <td class="auto-style3">
            <asp:Label ID="Label9" runat="server" Text="Email Address:"></asp:Label>
        </td>
        <td class="auto-style7">
            &nbsp;</td>
        <td class="auto-style6">
            <asp:TextBox ID="txtEmailAddr" runat="server" Width="154px" ToolTip="name@domain.com" Font-Size="9pt"></asp:TextBox>
        </td>
        <td class="auto-style5">
            <asp:RequiredFieldValidator ID="RequiredFieldValidator7" runat="server" ControlToValidate="txtEmailAddr" ErrorMessage="eMail Address is required" ForeColor="#990033" Display="Dynamic" SetFocusOnError="True"></asp:RequiredFieldValidator>
            <asp:RegularExpressionValidator ID="RegularExpressionValidator4" runat="server" ControlToValidate="txtEmailAddr" Display="Dynamic" ErrorMessage="e-mail is not in the valid format. E.g.  name@domain.com" ForeColor="#990033" SetFocusOnError="True" ValidationExpression="^[a-zA-Z0-9._-]+@[a-zA-Z0-9.-]+\.[a-zA-Z]{2,6}$"></asp:RegularExpressionValidator>
        </td>
    </tr>
    <tr>
        <td class="auto-style3">
            <asp:Label ID="Label10" runat="server" Text="Password:"></asp:Label>
        </td>
        <td class="auto-style7">
            &nbsp;</td>
        <td class="auto-style6">
            <asp:TextBox ID="txtUserPwd" runat="server" Width="154px" TextMode="Password" ToolTip="Must have at least 6 characters and must contain at least one digit character" Font-Size="9pt"></asp:TextBox>
        </td>
        <td class="auto-style5">
            <asp:RequiredFieldValidator ID="RequiredFieldValidator8" runat="server" ErrorMessage="Password is a required field" ForeColor="#990033" ControlToValidate="txtUserPwd" Display="Dynamic"></asp:RequiredFieldValidator>
            <asp:RegularExpressionValidator ID="RegularExpressionValidator1" runat="server" ControlToValidate="txtUserPwd" Display="Dynamic" ErrorMessage="Must have at least 6 characters and must contain at least one digit character" ForeColor="#990033" ValidationExpression="^.*(?=.{6,})(?=.*[a-zA-Z])(?=.*\d).*$"></asp:RegularExpressionValidator>
        </td>
    </tr>
    <tr>
        <td class="auto-style3">
            <asp:Label ID="Label11" runat="server" Text="Confirm Password:"></asp:Label>
        </td>
        <td class="auto-style7">
            &nbsp;</td>
        <td class="auto-style6">
            <asp:TextBox ID="txtConPwd" runat="server" Width="151px" TextMode="Password" Font-Size="9pt"></asp:TextBox>
        </td>
        <td class="auto-style5">
            <asp:CompareValidator ID="CompareValidator1" runat="server" ControlToCompare="txtUserPwd" ControlToValidate="txtConPwd" Display="Dynamic" ErrorMessage="Password fields must match" ForeColor="#990033"></asp:CompareValidator>
            <asp:RequiredFieldValidator ID="RequiredFieldValidator9" runat="server" ControlToValidate="txtConPwd" Display="Dynamic" ErrorMessage="Re-type the password" ForeColor="#990033"></asp:RequiredFieldValidator>
        </td>
    </tr>
    <tr>
        <td class="auto-style3">&nbsp;</td>
        <td class="auto-style7">
            &nbsp;</td>
        <td class="auto-style6">
            <asp:Button ID="btnReg" runat="server" OnClick="btnRegister_Click" Text="Register Now" Width="161px" BackColor="#00698C" ForeColor="White" style="font-weight: 700; font-family: Arial, Helvetica, sans-serif;" BorderColor="#003366" BorderStyle="Groove" Height="21px" />
        </td>
        <td class="auto-style5">&nbsp;</td>
    </tr>
</table>

